<template>
  <view>
    <u-navbar :background="{ background: '' }" back-icon-color="#222222" title-color="#222222" :is-back="false" :immersive="true" :border-bottom="false"></u-navbar>
    <view class="" style="width: 100%; height: 300rpx; background: url(https://wenzhen.jiangkukeji360.com/static/index/bg.png) no-repeat; background-size: 100% 100%">
      <view class="" style="height: 70rpx"></view>
      <view class="" style="display: flex; align-items: center; margin: 60rpx 28rpx; justify-content: space-between">
        <view class="" style="display: flex; align-items: center">
          <image src="https://wenzhen.jiangkukeji360.com/static/logo.png" mode="" style="width: 72rpx; height: 72rpx; border-radius: 50%"></image>
          <view class="" style="font-size: 36rpx; font-weight: bold; padding-left: 29rpx">问诊系统</view>
        </view>
        <view class="" style="width: 100rpx; height: 100rpx; text-align: center" @tap="sao">
          <image src="https://wenzhen.jiangkukeji360.com/static/sao.png" mode="" style="width: 50rpx; height: 50rpx; margin-top: 25rpx"></image>
        </view>
      </view>

      <!-- 搜索 -->
      <view
        class=""
        style="
          margin: 24rpx 28rpx;
          box-shadow: 0px 0px 10rpx 0px rgba(0, 161, 255, 0.2);
          border-radius: 36rpx;
          background: #fff;
          display: flex;
          align-items: center;
          height: 72rpx;
          justify-content: space-between;
        "
        @tap="search(0)"
      >
        <view class="" style="display: flex; align-items: center; padding-left: 25rpx">
          <view class="">
            <image src="https://wenzhen.jiangkukeji360.com/static/index/sousuo.png" mode="" style="width: 34rpx; height: 34rpx"></image>
          </view>
          <view class="">
            <input type="text" placeholder="根据疾病、医院、姓名搜索" style="font-size: 26rpx; color: #999999; padding-left: 19rpx" :disabled="true" />
          </view>
        </view>

        <view class="" style="display: flex; align-items: center; padding-right: 35rpx">
          <view class="" style="width: 2rpx; height: 30rpx; background: #90d1ff"></view>
          <view class="" style="font-size: 28rpx; color: #1a9fff; padding-left: 30rpx">搜索</view>
        </view>
      </view>
    </view>
    <view class="" style="height: 80rpx"></view>
    <!-- 挂号 -->
    <view class="" style="margin: 30rpx 28rpx; background: #fff; border-radius: 30rpx">
      <view class="" style="display: flex; align-items: center; justify-content: center; padding-top: 51rpx">
        <view class="" style="padding-top: 10rpx">
          <image src="https://wenzhen.jiangkukeji360.com/static/index/num.png" mode="" style="width: 186rpx; height: 36rpx"></image>
        </view>
        <view class="" style="font-size: 32rpx; font-weight: bold">三甲名医在线问诊</view>
      </view>
      <!-- dispaly -->
      <view class="" style="display: flex; align-items: center; justify-content: space-between; padding: 40rpx 42rpx 46rpx 48rpx">
        <view class="" style="text-align: center" v-for="(i, k) in list" :key="k" @tap="search(k)">
          <image :src="'https://wenzhen.jiangkukeji360.com/static/index/i' + k + '.png'" mode="" style="width: 96rpx; height: 96rpx"></image>
          <view class="" style="font-size: 28rpx">
            {{ i.name }}
          </view>
        </view>
      </view>
    </view>
    <!-- 科室 -->
    <view class="" style="margin: 0 28rpx; background: #fff; border-radius: 20rpx">
      <view class="" style="display: flex; align-items: center; flex-wrap: wrap; padding: 0rpx 0rpx 47rpx 0">
        <view class="" style="text-align: center; width: 25%; margin-top: 47rpx" v-for="(i, k) in arr" :key="k" @tap="ke(i.department_id)">
          <image :src="'https://wenzhen.jiangkukeji360.com/static/index/m' + k + '.png'" mode="" style="width: 96rpx; height: 96rpx"></image>
          <view class="" style="font-size: 28rpx">
            {{ i.department_name }}
          </view>
        </view>
      </view>
    </view>
    <!-- 问诊健康商城 -->
    <view
      class=""
      style="
        margin: 26rpx 28rpx;
        background: linear-gradient(-90deg, #ebf7ff 0%, #dbf0ff 50%, #ecf7ff 100%);
        border-radius: 20rpx;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 7rpx 18rpx 3rpx 14rpx;
      "
      @tap="shop"
    >
      <view class="" style="display: flex; align-items: center">
        <image src="https://wenzhen.jiangkukeji360.com/static/index/shop.png" mode="" style="width: 90rpx; height: 90rpx"></image>
        <view class="" style="font-size: 32rpx; font-weight: bold; padding-left: 36rpx">问诊健康商城</view>
      </view>
      <view class="">
        <u-icon name="arrow-right-double" color="#666666" size="26" label="去逛逛" label-size="26" label-color="#666666" label-pos="left"></u-icon>
      </view>
    </view>
    <!-- 轮播图 -->
    <view class="" style="margin: 0 28rpx">
      <u-swiper :list="list1" height="282"></u-swiper>
    </view>
    <!-- 知名专家 -->
    <view class="" style="margin: 26rpx 28rpx; background: linear-gradient(180deg, #fff4e2 0%, #fffcf8 100%); border-radius: 20rpx">
      <view class="" style="display: flex; align-items: center; padding: 29rpx 21rpx 16rpx 35rpx; justify-content: space-between">
        <view class="" style="font-size: 32rpx; font-weight: bold">知名专家</view>
        <view class="" @tap="famous">
          <u-icon name="arrow-right-double" color="#666666" size="26" label="更多" label-size="26" label-color="#666666" label-pos="left"></u-icon>
        </view>
      </view>
      <view class="" style="font-size: 24rpx; padding-left: 34rpx">经验多 更放心</view>
      <scroll-view :scroll-top="scrollTop" scroll-x="true" class="scroll-Y" style="white-space: nowrap">
        <view class="" style="display: flex; align-items: center">
          <view class="" style="text-align: center; padding: 43rpx 16rpx 35rpx 16rpx" v-for="(i, k) in getlist" :key="k" @tap="tech(i.doctor_id)">
            <view class="" style="position: relative">
              <image :src="i.doctor_avatar" mode="aspectFill" style="width: 112rpx; height: 112rpx; border-radius: 50%"></image>
              <view
                class=""
                style="
                  width: 64rpx;
                  height: 34rpx;
                  background: #ff7251;
                  border-radius: 17rpx;
                  font-size: 22rpx;
                  color: #fff;
                  text-align: center;
                  line-height: 34rpx;
                  position: absolute;
                  top: 89rpx;
                  left: 35%;
                "
              >
                {{ i.level_name }}
              </view>
            </view>
            <view class="" style="display: flex; font-size: 28rpx; align-items: center; justify-content: center; padding-top: 22rpx">
              <view class="">
                {{ i.doctor_name }}
              </view>
              <view class="" style="font-size: 24rpx; color: #666666; padding-left: 12rpx">
                {{ i.doctor_title }}
              </view>
            </view>
            <view
              class=""
              style="
                font-size: 24rpx;
                color: #666666;
                text-align: center;
                -webkit-line-clamp: 1;
                -webkit-box-orient: vertical;
                overflow: hidden;
                text-overflow: ellipsis;
                width: 233rpx;
              "
            >
              {{ i.hospital_name }}
            </view>
            <view class="btn" style="margin: 28rpx auto">
              {{ i.lable }}
            </view>
          </view>
        </view>
      </scroll-view>
    </view>
    <!-- 三甲专家 -->
    <view class="" style="margin: 26rpx 28rpx; background: linear-gradient(180deg, #e1f3ff 0%, #fffcf8 100%); border-radius: 20rpx">
      <view class="" style="display: flex; align-items: center; padding: 29rpx 21rpx 16rpx 35rpx; justify-content: space-between">
        <view class="" style="font-size: 32rpx; font-weight: bold">专家义诊</view>
        <view class="" @tap="sanjia">
          <u-icon name="arrow-right-double" color="#666666" size="26" label="更多" label-size="26" label-color="#666666" label-pos="left"></u-icon>
        </view>
      </view>
      <view class="" style="font-size: 24rpx; padding-left: 34rpx">每日精选名医</view>
      <scroll-view :scroll-top="scrollTop" scroll-x="true" class="scroll-Y" style="white-space: nowrap">
        <view class="" style="display: flex; align-items: center">
          <view class="" style="text-align: center; padding: 43rpx 16rpx 35rpx 16rpx" v-for="(i, k) in getlist1" :key="k" @tap="sanjia">
            <view class="" style="position: relative">
              <image :src="i.doctor_avatar" mode="aspectFill" style="width: 112rpx; height: 112rpx; border-radius: 50%"></image>
              <view
                class=""
                style="
                  width: 64rpx;
                  height: 34rpx;
                  background: #ff7251;
                  border-radius: 17rpx;
                  font-size: 22rpx;
                  color: #fff;
                  text-align: center;
                  line-height: 34rpx;
                  position: absolute;
                  top: 89rpx;
                  left: 35%;
                "
              >
                {{ i.level_name }}
              </view>
            </view>
            <view class="" style="display: flex; font-size: 28rpx; align-items: center; justify-content: center; padding-top: 22rpx">
              <view class="">
                {{ i.doctor_name }}
              </view>
              <view class="" style="font-size: 24rpx; color: #666666; padding-left: 12rpx">
                {{ i.doctor_title }}
              </view>
            </view>
            <view
              class=""
              style="
                font-size: 24rpx;
                color: #666666;
                text-align: center;
                -webkit-line-clamp: 1;
                -webkit-box-orient: vertical;
                overflow: hidden;
                text-overflow: ellipsis;
                width: 233rpx;
              "
            >
              {{ i.hospital_name }}
            </view>
            <view class="btn" style="margin: 28rpx auto; background: #eef8ff">
              {{ i.lable[0].label_title }}
            </view>
          </view>
        </view>
      </scroll-view>
    </view>
    <!-- 快速回复 -->
    <view class="" style="margin: 26rpx 28rpx; background: linear-gradient(180deg, #ffe8e3 0%, #fffcf8 100%); border-radius: 20rpx">
      <view class="" style="display: flex; align-items: center; padding: 29rpx 21rpx 16rpx 35rpx; justify-content: space-between">
        <view class="" style="font-size: 32rpx; font-weight: bold">快速回复专区</view>
        <view class="" @tap="hui">
          <u-icon name="arrow-right-double" color="#666666" size="26" label="更多" label-size="26" label-color="#666666" label-pos="left"></u-icon>
        </view>
      </view>
      <view class="" style="font-size: 24rpx; padding-left: 34rpx">快速响应 守护健康</view>
      <scroll-view :scroll-top="scrollTop" scroll-x="true" class="scroll-Y" style="white-space: nowrap">
        <view class="" style="display: flex; align-items: center">
          <view class="" style="width: 233rpx; text-align: center; padding: 43rpx 16rpx 35rpx 16rpx" v-for="(i, k) in getlist2" :key="k" @tap="tech(i.doctor_id)">
            <view class="" style="position: relative">
              <image :src="i.doctor_avatar" mode="aspectFill" style="width: 112rpx; height: 112rpx; border-radius: 50%"></image>
              <view
                class=""
                style="
                  width: 64rpx;
                  height: 34rpx;
                  background: #ff7251;
                  border-radius: 17rpx;
                  font-size: 22rpx;
                  color: #fff;
                  text-align: center;
                  line-height: 34rpx;
                  position: absolute;
                  top: 89rpx;
                  left: 35%;
                "
              >
                {{ i.level_name }}
              </view>
            </view>
            <view class="" style="display: flex; font-size: 28rpx; align-items: center; justify-content: center; padding-top: 22rpx">
              <view class="">
                {{ i.doctor_name }}
              </view>
              <view class="" style="font-size: 24rpx; color: #666666; padding-left: 12rpx">
                {{ i.doctor_title }}
              </view>
            </view>
            <view
              class=""
              style="
                font-size: 24rpx;
                color: #666666;
                text-align: center;
                -webkit-line-clamp: 1;
                -webkit-box-orient: vertical;
                overflow: hidden;
                text-overflow: ellipsis;
                width: 233rpx;
              "
            >
              {{ i.hospital_name }}
            </view>
            <view class="btn" style="margin: 28rpx auto; background: #ffede8">
              {{ i.lable[0].label_title }}
            </view>
          </view>
        </view>
      </scroll-view>
    </view>
    <!-- 慢病管理 -->
    <view
      class=""
      style="
        margin: 26rpx 28rpx;
        background: linear-gradient(-90deg, #ebf7ff 0%, #dbf0ff 50%, #ecf7ff 100%);
        border-radius: 20rpx;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 18rpx 28rpx 22rpx 30rpx;
      "
    >
      <view class="" style="display: flex; align-items: center">
        <image src="https://wenzhen.jiangkukeji360.com/static/index/mbgl.png" mode="" style="width: 60rpx; height: 60rpx"></image>
        <view class="" style="font-size: 32rpx; font-weight: bold; padding-left: 36rpx">慢病管理</view>
      </view>
      <view class="" @tap="emit">
        <u-icon name="arrow-right-double" color="#666666" size="26" label="立即查看" label-size="26" label-color="#666666" label-pos="left"></u-icon>
      </view>
    </view>
    <view class="" style="position: fixed; bottom: 189rpx; right: 22rpx" @tap="kefu">
      <image src="https://wenzhen.jiangkukeji360.com/static/fen.png" mode="" style="width: 184rpx; height: 92rpx"></image>
    </view>
    <!-- 找名医 -->
    <!-- <view class="" style="display: flex;align-items: center;padding: 10rpx 0 43rpx 32rpx;">
			<view class="" style="font-size: 32rpx;font-weight: bold;">
				找名医
			</view>
			<view class="" style="font-size: 26rpx;color: #666666;padding-left: 19rpx;">
				4万专家在线接诊
			</view>
		</view> -->
    <!-- 下拉选择 -->
    <!-- <view class="" style="display: flex;align-items: center;padding:  0 70rpx;justify-content: space-between;">
			<view class="" style="display: flex;align-items: center;">
				<view class="" style="font-size: 28rpx;">
					综合
				</view>
				<image src="http://wenzhen.jiangkukeji360.com/static/index/down.png" mode=""
					style="width: 16rpx;height: 10rpx;padding-left: 11rpx;"></image>
			</view>

			<view class="" style="display: flex;align-items: center;">
				<view class="" style="font-size: 28rpx;">
					科室
				</view>
				<image src="http://wenzhen.jiangkukeji360.com/static/index/down.png" mode=""
					style="width: 16rpx;height: 10rpx;padding-left: 11rpx;"></image>
			</view>

			<view class="" style="display: flex;align-items: center;">
				<view class="" style="font-size: 28rpx;">
					地区
				</view>
				<image src="http://wenzhen.jiangkukeji360.com/static/index/down.png" mode=""
					style="width: 16rpx;height: 10rpx;padding-left: 11rpx;"></image>
			</view>

			<view class="" style="display: flex;align-items: center;">
				<view class="" style="font-size: 28rpx;">
					更多
				</view>
				<image src="http://wenzhen.jiangkukeji360.com/static/index/down.png" mode=""
					style="width: 16rpx;height: 10rpx;padding-left: 11rpx;"></image>
			</view>

		</view> -->
    <!-- 医生 -->
    <!-- <view class="" style="margin: 28rpx;background: #fff;border-radius: 20rpx;">
			<view class="" style="display: flex;">
				<view class="" style="position: relative;margin: 43rpx 35rpx 0 30rpx;">
					<image src="http://wenzhen.jiangkukeji360.com/static/ys.jpg" mode="aspectFill"
						style="width: 112rpx;height: 112rpx;border-radius: 50%;"></image>
					<view class=""
						style="width: 64rpx;height: 34rpx;background: #FF7251;border-radius: 17rpx;font-size: 22rpx;color: #fff;text-align: center;line-height: 34rpx;position: absolute;top: 89rpx;left: 23rpx;">
						三甲
					</view>
				</view> -->
    <!-- 医师信息 -->
    <!-- <view class="" style="padding-top: 50rpx;">
					<view class="" style="display: flex;align-items: flex-end;">
						<view class="" style="font-size: 32rpx;">
							许三多
						</view>
						<view class="" style="font-size: 26rpx;padding-left: 16rpx;">
							主任医师
						</view>
					</view>

					<view class=""
						style="display: flex;align-items: flex-end;font-size: 26rpx;color: #666666;padding-top: 10rpx;">
						<view class="">
							皮肤科
						</view>
						<view class="" style="padding-left: 29rpx;">
							河南大学第一附属医院
						</view>
					</view>

					<view class="" style="display: flex;align-items: center;padding-top: 10rpx;">
						<view class="">
							<text style="font-size: 28rpx;color: #E50014;">4.9</text>
							<text style="font-size: 26rpx;color: #999999;padding-left: 9rpx;">分</text>
						</view>
						<view class="" style="padding-left: 26rpx;">
							<text style="font-size: 28rpx;color: #E50014;">256</text>
							<text style="font-size: 26rpx;color: #999999;padding-left: 9rpx;">评价</text>
						</view>
						<view class="" style="padding-left: 27rpx;">
							<text style="font-size: 28rpx;color: #E50014;">1888</text>
							<text style="font-size: 26rpx;color: #999999;padding-left: 9rpx;"> 服务数</text>
						</view>
					</view>
					<view class="" style="font-size: 26rpx;color: #999999;padding-top: 15rpx;padding-right: 50rpx;">
						擅长：头痛、失眠、高血压、高血脂、便
						秘头痛、失眠、高血压、高血脂、便秘...
					</view>
					<view class="" style="display: flex;align-items: center;">
						<view class="btn" style="background: #FFEDE8;margin-right: 30rpx;">
							国医大师
						</view>
						<view class="btn" style="background: #FFEDE8;">
							国医大师
						</view>
					</view>

				</view>
			</view>
			<view class=""
				style="display: flex;align-items: center;justify-content: space-between;padding: 33rpx 45rpx 34rpx 39rpx;">
				<view class="" style="font-size: 26rpx;display: flex;align-items: center;">
					<image src="http://wenzhen.jiangkukeji360.com/static/index/wz.png" mode="" style="width: 34rpx;height: 34rpx;"></image>
					<view class="" style="padding-left: 9rpx;">
						问诊￥20
					</view>
				</view>
				<view class="" style="font-size: 26rpx;display: flex;align-items: center;">
					<image src="http://wenzhen.jiangkukeji360.com/static/index/tw.png" mode="" style="width: 34rpx;height: 34rpx;"></image>
					<view class="" style="padding-left: 9rpx;">
						提问￥20
					</view>
				</view>
				<view class="" style="font-size: 26rpx;display: flex;align-items: center;">
					<image src="http://wenzhen.jiangkukeji360.com/static/index/yuyue.png" mode="" style="width: 34rpx;height: 34rpx;"></image>
					<view class="" style="padding-left: 9rpx;">
						预约挂号
					</view>
				</view>
			</view>
		</view> -->
    <u-modal v-model="showup" confirm-text="升级" title="发现新版本" @confirm="confirm">
      <view class="u-update-content">
        <rich-text :nodes="content"></rich-text>
      </view>
    </u-modal>
  </view>
</template>

<script>
// import * as GenerateTestUserSig from '@/TUICallKit/debug/GenerateTestUserSig-es.js';
// 导入 CallManager 模块，使您的应用具有全局监听来电的能力
// import { CallManager } from '@/TUICallKit/src/TUICallService/serve/callManager';
// uni.CallManager = new CallManager();
export default {
  data() {
    return {
      scrollTop: 0,
      list: [
        {
          name: '去问诊'
        },
        {
          name: '去挂号'
        },
        {
          name: '极速问诊'
        },
        {
          name: '按方开药'
        }
      ],
      arr: [],
      arr1: [
        {
          name: '儿童皮肤科'
        },
        {
          name: '综合科'
        },
        {
          name: '更多'
        }
      ],
      list1: [],
      getlist: [],
      getlist1: [],
      getlist2: [],
      showup: false,
      content: '请升级到最新版本，带给您更好的体验'
    };
  },
  onLoad() {
    console.log(this.tim);
    // this.up()
    this.banner();
    // this.getsig();
  },
  methods: {
    // getsig() {
    //   this.api({
    //     url: '/api/chat/getSign',
    //     method: 'post'
    //   }).then(async (data) => {
    //     console.log('usersig', data.data);
    //     uni.setStorageSync('usersig', data.data);
    //     await uni.CallManager.init({
    //       sdkAppID: 1600052101,
    //       userID: String(uni.getStorageSync('user_info').id),
    //       userSig: data.data,
    //       globalCallPagePath: 'TUICallKit/src/Components/TUICallKit'
    //     });
    //   });
    // },
    sao() {
      console.log('----');
      // uni.scanCode({
      // 	success:res=>{
      // 		console.log('条码类型：' + res.scanType);
      // 		console.log('条码内容：' + res.result);
      // 	}
      // });
      uni.scanCode({
        success: (res) => {
          console.log('条码类型：' + res.scanType);
          console.log('条码内容：' + res.result);
          if (res.result) {
            console.log(this.getUrlCode(res.result));
            uni.navigateTo({
              url: '/pages/index/doctor?id=' + this.getUrlCode(res.result)
            });
          }

          // _this.util.request('/api/index/scan_code', {
          // 	param: res.result,
          // 	machine_code: _this.deviceId
          // }, "post", 1)
        }
      });
    },
    getUrlCode(e) {
      // 截取url中的code方法
      var url = e;
      var strs = url.split('?')[1];
      var id = strs.split('=')[1];
      console.log(id);
      // var theRequest = new Object()
      // if (url.indexOf("?") != -1) {
      // 	var str = url.substr(1)

      // 	for(var i = 0; i < strs.length; i ++) {
      // 		theRequest[strs[i].split("=")[0]]=(strs[i].split("=")[1])
      // 	}
      // }
      return id;
    },
    confirm() {},
    up() {
      this.api({
        url: '/api/common/getVersion',
        method: 'post'
      }).then((data) => {
        if (uni.getSystemInfoSync().platform == 'android') {
          if (res.data.newversion != plus.runtime.version) {
            this.content = res.data.content;
            this.url = res.data.downloadurl;
            this.showup = true;
          }
        } else if (uni.getSystemInfoSync().platform == 'ios') {
        }
      });
    },
    kefu() {
      uni.navigateTo({
        url: '/home/kefu/kefu'
      });
    },
    ke(e) {
      uni.navigateTo({
        url: '/yuhosp/yuhosp/yuhosp?id=' + e
      });
    },
    emit() {
      uni.navigateTo({
        url: '/home/slow/slow'
      });
    },
    shop() {
      uni.switchTab({
        url: '/pages/shop/shop'
      });
    },
    search(e) {
      if (e == 0) {
        uni.navigateTo({
          url: '/look/look/look?type=' + e
        });
      } else if (e == 1) {
        uni.navigateTo({
          url: '/look/look/look?type=' + e
        });
      } else if (e == 2) {
        uni.navigateTo({
          url: '/home/topspeed/topspeed'
        });
      } else {
        uni.navigateTo({
          url: '/news/press/press'
        });
      }
    },
    tech(e) {
      uni.navigateTo({
        url: '/doctor/doctor/doctor?id=' + e
      });
    },
    famous() {
      uni.navigateTo({
        url: '/home/famous/famous'
      });
    },
    sanjia() {
      uni.navigateTo({
        url: '/home/see/see'
      });
    },
    hui() {
      uni.navigateTo({
        url: '/home/reply/reply'
      });
    },
    banner() {
      this.api({
        url: '/api/common/carousel',
        method: 'post',
        data: {
          type: 1
        }
      }).then((res) => {
        res.data.map((i) => {
          this.list1.push({
            image: this.img_url + i.image
          });
        });
      });
      this.api({
        url: '/api/doctor/department',
        method: 'post'
      }).then((res) => {
        this.arr = res.data;
      });
    },
    hsop() {
      this.api({
        url: '/api/doctor/getExpertList',
        method: 'post',
        data: {
          type: 1
        }
      }).then((res) => {
        this.getlist = res.data;
      });
      this.api({
        url: '/api/doctor/getClinicList',
        method: 'post',
        data: {
          type: 1
        }
      }).then((res) => {
        this.getlist1 = res.data.doctor;
      });
      this.api({
        url: '/api/doctor/getReplyList',
        method: 'post',
        data: {
          type: 1
        }
      }).then((res) => {
        this.getlist2 = res.data;
      });
    }
  },
  onShow() {
    this.hsop();
  }
};
</script>

<style>
page {
  background: #f8f8f8;
}

.btn {
  width: 140rpx;
  height: 41rpx;
  background: #fff1e5;
  border-radius: 4rpx;
  text-align: center;
  line-height: 41rpx;
  font-size: 24rpx;
  color: #ff801e;
}
</style>
